<template>
  <el-dialog
    v-fullScreen
    title="设备详情"
    :visible.sync="visible"
    width="70%"
    :close-on-click-modal="false"
  >
    <div class="el-dialog-div">
      <el-descriptions
        class="margin-top"
        :column="2"
        size="medium"
        border
      >
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            设备id
          </template>
          {{data.devId}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            机车号
          </template>
          {{data.en}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            车次号
          </template>
          {{data.tn}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            线路名称
          </template>
          {{data.lineName}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            当前位置纬度
          </template>
          {{data.latitude}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            当前位置经度
          </template>
          {{ data.longitude }}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            卫星定位时间
          </template>
          {{data.gpsTime}}
        </el-descriptions-item>

        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            本机IP地址
          </template>
          {{data.locIp}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            通信制式
          </template>
          {{data.workingMode}}
        </el-descriptions-item>

        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            机车号注册状态
          </template>
          {{data.enRegisterState}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            车次号注册状态
          </template>
          {{data.tnRegisterState}}
        </el-descriptions-item>

        <el-descriptions-item>
          <template slot="label">
            <i class="el-icon-message"></i>
            更新时间
          </template>
          {{updateTime}}
        </el-descriptions-item>

      </el-descriptions>
    </div>
  </el-dialog>
</template>

<script>
import { getAction } from '@/api/manage';
import { getNowDate } from '@/util/util';
export default {
  data() {
    return {
      visible: false,
      data: {},
    };
  },
  computed: {
    updateTime() {
      return getNowDate(this.data.updateTime);
    },
  },
  methods: {
    show(id) {
      this.visible = true;
      getAction('/device/queryDevBasicStateById', { id: id })
        .then((res) => {
          if (res.code == 200) {
            this.data = res.data;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((err) => {
          this.$message.error(err.message);
        });
    },
  },
};
</script>

<style scoped>
.el-dialog-div {
  height: 50vh;
  overflow: auto;
}
</style>